<template>
	<unit-table
		:columns="this.$staticMenu.needsColumns"
		:url="tableUrl"
		:type="tableType"
     selectType="checkbox"
		:params="tableParams"
		:size="pageSize"
		:sizeOptions="pageSizeOptions"
		rowKeyName="id"
		ref="unitTable"
		@onSelect="tableOnSelect"
	>
		<!-- 补充搜索条件 -->
		<a-row slot="searchCri">
			<a-col :span="3">
				<a-select
					class="searchCriteria"
					@change="handleNeedChange"
					v-model="tableParams.classify"
					>
				     <a-select-option value="">
					      全部需求分类
					 </a-select-option>
					 <a-select-option value="生产任务">
             生产任务
					    </a-select-option>
					    <a-select-option value="评估任务">
                评估任务
					    </a-select-option>
				</a-select>
			</a-col>

      <a-col :span="3">
        <a-input v-model="tableParams.name" class="searchCriteria" placeholder="需求名称"/>
      </a-col>
      <a-col :span="3">
        <a-input v-model="tableParams.people" class="searchCriteria" placeholder="上报人"/>
      </a-col>
      <a-col :span="3">
        <a-range-picker v-model="time" @change="handleDateChange"/>
      </a-col>
      <a-col :span="12" style="text-align: right;">
        <a-button type="primary" @click="criteriaSearch">
          <a-icon type="search"/>
          查询
        </a-button>
        <a-button @click="clearCriteria">
          <a-icon type="sync"/>
          </i>重置
        </a-button>
      </a-col>
    </a-row>
    <!-- end -->
    <!-- 补充表格操作 -->
    <div slot='tableAct' class="actionBtn">
      <a-button v-if="this.isManager" type="primary" @click="acceptAll">
        <a-icon type="check"/>
        审批通过
      </a-button>
      <a-button v-if="this.isManager" @click="rejectAll">
        <a-icon type="close"/>
        拒绝
      </a-button>
    </div>
    <!-- end -->
    <span slot="statusSwitch" slot-scope="props">
			<span v-if="props.record.status=='审批通过'" class="text-success">
				{{ props.record.status }}
			</span>
			<span v-if="props.record.status=='审批拒绝'" class="text-danger">
				{{ props.record.status }}
			</span>
			<span v-if="props.record.status=='未审批'">
				{{ props.record.status }}
			</span>
		</span>
    <!-- 补充表格每行的操作 -->
    <span slot="tableRowAct" slot-scope="props">
				<a>
					<span class="ant-tag" @click="downloadData(props.record)">
						<a-icon type="download"/>下载
					</span>
				</a>
			</span>
  </unit-table>
</template>

<script>
  import {GETNEEDLIST, NEEDACCEPT, NEEDREJECT} from '@/../static/js/apis.js'
  import unitTable from "@/common/table"
  import global from "@/../static/global.vue"

  export default {
    inject: ['reload'],                                 //注入App里的reload方法
    name: 'allUnit',
    components: {
      unitTable
    },
    data() {
      return {
        treeSelectedKeys: '0',
        tableSelectedKeys: [],
        tableUrl: GETNEEDLIST.url,  //调用表格组件，必须参数，后台数据接口
        tableType: GETNEEDLIST.type,  //调用表格组件，必须参数，后台方法方法（get，post）
        pageSize: 15,
        pageSizeOptions: ['15', '20', '40'],
        /*调用表格组件，可选参数，其他相关搜索条件*/
        tableParams: {
          classify: "",
          name: "",
          people: "",
          starttime: "",
          endtime: ""
        },
        time: [],
        userRole: localStorage.getItem("role")
      }
    },
    methods: {
      /*表格checkbox选中事件*/
      tableOnSelect(selectedRowKeys, selectedRows) {
        this.tableSelectedKeys = selectedRowKeys
      },
      /*查询按钮*/
      criteriaSearch() {
        this.$refs.unitTable.fetch(1)
      },
      /*重置按钮*/
      clearCriteria() {
        this.tableParams.classify = ''
        this.tableParams.name = ''
        this.tableParams.people = ''
        this.tableParams.starttime = ''
        this.tableParams.endtime = ''
        this.time = []
        this.$refs.unitTable.rowSelection.onChange([ ],[ ])
        this.criteriaSearch()
      },
      /*选择当前状态*/
      handleNeedChange(value) {
        this.tableParams.classify = value
      },
      handleDateChange(date, dateString) {
        this.tableParams.starttime = dateString[0]
        this.tableParams.endtime = dateString[1]
      },
      acceptAll() {
        let self = this
        const selectedRowKeys = self.tableSelectedKeys
        var params = {
          ids: selectedRowKeys,
          userid: parseInt(localStorage.getItem("userid"))
        }
        if (selectedRowKeys.length > 0) {
          NEEDACCEPT(params, function (res) {
            self.$message.success(res.message)
            self.reload()

          })
        } else {
          self.$message.warning("请在表格中勾选要审批的数据！")
        }
      },
      rejectAll() {
        let self = this
        const selectedRowKeys = self.tableSelectedKeys
        var params = {
          ids: selectedRowKeys,
          userid: parseInt(localStorage.getItem("userid"))
        }
        if (selectedRowKeys.length > 0) {
          NEEDREJECT(params, function (res) {
            self.$message.success(res.message)
            self.reload()

          })
        } else {
          self.$message.warning("请在表格中勾选要审批的数据！")
        }
      },
      downloadData(record) {
        let id = record.id
        window.open(global.bussinessManUrl + "/demandsubmit/download?id=" + id);
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .searchCriteria {
    width: 90%;
  }

  .actionBtn button:not(:last-child),
  .ant-row button:not(:last-child) {
    margin-right: 20px;
  }
</style>
